<template>
    <Modal
        :draggable="!this.$config.mask"
        :mask="this.$config.mask"
        :mask-closable="!this.$config.mask"
        :value="value"
        @on-ok="save"
        @on-visible-change="visibleChange"
        :width="1000">
        <p slot="header">
            处理：{{modalData.instance.name}}
        </p>
        <Form ref="verifyForm" :model="verify" label-position="top" :rules="verifyRule">
            <FormItem label="处理意见" prop="description">
                <Input type="textarea" v-model="verify.description" placeholder=""></Input>
            </FormItem>
        </Form>
        <div slot="footer">
            <Button icon="md-close" @click="cancel">取消</Button>
            <Button icon="md-checkmark" @click="save(2)" type="error">拒绝</Button>
            <Button icon="md-checkmark" @click="save(3)" type="warning">驳回</Button>
            <Button icon="md-checkmark" type="success" @click="save(1)">同意</Button>
        </div>
    </Modal>
</template>

<script lang="ts">
import {Component, Vue, Prop, Watch, Emit} from 'vue-property-decorator';
import AbpBase from '@/lib/abpbase';
import AllotWithInstanceId from '@/store/entities/flow/flow-instance/allot-with-instance-id';
import Runtime from '@/views/flow/flow-instance/module/runtime';
import _ from 'lodash';

@Component({
    components: {},
})
export default class VerifyModal extends AbpBase {
    name: string = 'VerifyModal';
    @Prop({type: Boolean, default: false}) value: boolean;
    @Prop({type: Object, default: {}}) modalData: any;

    verify: AllotWithInstanceId = new AllotWithInstanceId();
    verifyRule = {
        description:[
            {
                required: true,
                message: '处理意见是必须的',
                trigger: 'blur,change',
            },
        ],
    };



    visibleChange(value: boolean) {
        if (!value) {
            this.reset();
            this.$emit('input', value);
        }
    }

    cancel() {

        this.$emit('input', false);
    }

    save(signState:number) {
        (this.$refs.verifyForm as any).validate(async (valid: boolean) => {
            if (valid) {
                this.$set(this.verify,'instanceId',this.modalData.instance.id);
                const nextUserIds=this.modalData.instance.nextUserIds.split(',');
                this.$set(this.verify,'signState',signState);
                const v=_.cloneDeep(this.verify);
                const runtime:Runtime=new Runtime(this.modalData.instance);
                if(signState===1 && (nextUserIds.length===1 ||(nextUserIds.length>1 && runtime.currentNode.info.joinType==='ANY')) && runtime.nextNode.type==='task' && (runtime.nextNode.info.allot==='RUNNINGUSER' || runtime.nextNode.info.allot==='RUNNINGROLE')){

                    this.$emit('on-submit',false,v,runtime.nextNode.info);

                    this.$emit('input',false);
                }else{

                    await this.$store.dispatch({
                        type:'flowInstance/verifyNode',
                        data:v,
                    });
                    this.$emit('on-submit',true);

                    this.$emit('input',false);
                }
            }
        });
    }



    reset() {
        (this.$refs.verifyForm as any).resetFields();
        this.verify = new AllotWithInstanceId();
    }


}
</script>

<style lang="less" scoped>
div::v-deep textarea{
    height:345.64px;
}
</style>
